<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head th:replace="admin/fragment :: head('分类管理')"></head>
<body>

<!--导航-->
<nav th:replace="admin/fragment :: menu(2)"></nav>

<div class="ui attached pointing menu">
    <div class="ui container">
        <div class="right menu">
            <a th:href="@{/admin/types/add}" class="item">新增</a>
            <a th:href="@{/admin/types}" class="teal active item">列表</a>
        </div>
    </div>
</div>

<!--中间内容-->
<div class="m-container-small m-padded-tb-big">
    <div class="ui container">
        <div class="ui success message" th:unless="${#strings.isEmpty(msg)}">
            <i class="close icon"></i>
            <div class="header">提示：</div>
            <p th:text="${msg}">恭喜，操作成功！</p>
        </div>
        <table class="ui celled table">
            <thead>
            <tr>
                <th></th>
                <th>名称</th>
                <th>操作</th>
            </tr>
            </thead>
            <tbody>
            <tr th:each="type : ${pageInfo.list}">
                <td th:text="${type.id}"></td>
                <td th:text="${type.name}"></td>
                <td>
                    <a href="#" th:href="@{/admin/types/edit/{id}(id=${type.id})}"
                       class="ui mini teal basic button">编辑</a>
                    <a href="#" th:href="@{/admin/types/delete/{id}(id=${type.id})}"
                       class="ui mini red basic button" onclick="return confirm('确认要删除该分类吗?')">删除</a>
                </td>
            </tr>
            </tbody>
            <tfoot>
            <tr>
                <th colspan="6">
                    <div class="ui mini pagination menu">
                        <a th:href="@{/admin/types(pageNum=${pageInfo.hasPreviousPage}?${pageInfo.prePage}:1)}" class="  item"
                           th:unless="${pageInfo.isFirstPage}">上一页</a>
                        <a th:href="@{/admin/types(pageNum=${pageInfo.hasNextPage}?${pageInfo.nextPage}:${pageInfo.pages})}" class=" item"
                           th:unless="${pageInfo.isLastPage}">下一页</a>
                    </div>
                    <a href="#" th:href="@{/admin/types/add}" class="ui mini right floated teal basic button">新增</a>
                </th>
            </tr>
            </tfoot>
        </table>
    </div>
</div>

<br>
<br>
<!--底部footer-->
<footer th:replace="admin/fragment :: footer" class="ui inverted vertical segment m-padded-tb-massive"></footer>
<th:block th:replace="admin/fragment :: script"></th:block>

<script>
    $('.menu.toggle').click(function () {
        $('.m-item').toggleClass('m-mobile-hide');
    });

    $('.ui.dropdown').dropdown({
        on: 'hover'
    });

    //消息提示关闭初始化
    $('.message .close')
        .on('click', function () {
            $(this)
                .closest('.message')
                .transition('fade');
        });
</script>
</body>
</html>